/**
 * By Alpha
 * Author: alixez <alixe.z@foxmail.com>
 * Date: 2017/12/14
 */
import React from 'react';
import PropTypes from 'prop-types';
import { Spin, List } from 'antd';
import styles from './UserListPane.less';
import InfiniteScroll from 'react-infinite-scroller';

class UserListPane extends React.Component {

  static propTypes = {
    loading: PropTypes.bool,
    hasMore: PropTypes.bool,
    dataSource: PropTypes.array,
    onLoad: PropTypes.func,
    pageStart: PropTypes.number,
    renderListItem: PropTypes.func,
  };

  render () {
    const { dataSource, renderListItem, pageStart, loading, hasMore, onLoad } = this.props;
    return (
      <InfiniteScroll
        initialLoad={false}
        pageStart={pageStart}
        loadMore={onLoad}
        hasMore={!loading && hasMore}
        useWindow={false}
      >
        <List
          itemLayout="horizontal"
          dataSource={dataSource}
          renderItem={renderListItem}
        />
        {loading && hasMore && <Spin className={styles.loading} />}
      </InfiniteScroll>
    );
  }

}

export default UserListPane;
